<html>
<head>
    <title>历史数据</title>

    <link rel="stylesheet" href="../../../assets/bundle.element.css">
    <link rel="stylesheet" href="../../../style.css">
    <style>

        .main-head{
            background: #fff;
            padding-left: 10px;
            padding-top: 10px;
            margin-bottom: 0px;
        }

        .chart-outer{
            height: 300px;
            width: 90%;
        }
        .tab-title{
            margin-top: 20px;
            text-align: center;
            font-size: larger;
            color: #333333;
            font-weight: bold;
        }
    </style>
</head>
<body>
<div id="page-vue">
    <div class="page-title">历史数据</div>
    <div class="page-main">
        <el-row>
            <el-col :span="4">
                <dev-tree ref="devTree" v-on:click-node="nodeClick"></dev-tree>
            </el-col>

            <el-col :span="20">
                <div class="main-head">
                    <el-form :inline="true">
                        <el-form-item label="">
                            <el-date-picker  type="date" v-model="day" value-format="yyyy-MM-DD" placeholder="日期" style="width: 150px;"></el-date-picker>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="search">查询</el-button>
                        </el-form-item>
                    </el-form>
                </div>

                <el-table   border stripe style="width: 100%" :data="tabData" >
                    <el-table-column prop="name" label="监测项" align="center">
                    </el-table-column>
                    <el-table-column
                            v-for="(item,index) in dataFiled"
                            :prop="item.field" :label="item.name"  align="center">
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>
    </div>
</div>

<script type='text/javascript' src='../../../assets/bundle.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/jquery-1.11.2.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/echarts.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/common.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/component.js' charset='utf-8'></script>

<script>

    var vuePage=new Vue({
        el:'#page-vue',
        data:{
            tabData:[],
            dataFiled:[],
            energyType:'',
            day:'',
        },
        methods:{
            search:function(){
                this.loadParam();
            },
            nodeClick:function(){

            },
            loadParam:function(){

            },
            onChangePage:function(val){

            }

        },
        created:function(){
            this.energyType = HttpUtil.getQueryString('energyType');
        },
        mounted:function(){
            alert(this.energyType);
        }
    });


</script>


</body>

</html>
